/**
 * @author 云离
 * @date: 2018/12/28
 */
import React, { Component } from "react";
import { connect } from "react-redux";
import { withRouter } from "react-router-dom";
import { message, Spin, Table, Pagination } from "antd";
import axios from "../../../apis/api";
import qs from "qs";
import { subtractMoney } from "../../../utils/number";
import MyForm from "../../components/Form";
import moment from "moment";

const mapStateToProps = (state, ownProps) => {
  return {};
};

const mapDispatchToProps = dispatch => {
  return {};
};

class GroupStatTable extends Component {
  state = {
    formItmes: [],
    initForm: { "params[beginTime]": moment().subtract(1, "months") },
    searchParam: { params: { beginTime: moment().subtract(1, "months") } },
    loading: false,
    pageSize: 100,
    curPage: 1,
    tableData: {
      total: 0,
      rows: []
    },
    initCardForm: {},
    visibleDlg: false,
    cardFormTitle: "",
    cardFormType: "add",
    selectedRowKeys: []
  };

  componentDidMount() {
    this.getSalesman();
    this.searchTable(this.props);
  }

  getSalesman = async () => {
    const formItems = [
      {
        label: "开始时间",
        key: "params[beginTime]",
        type: "DatePicker"
      },
      {
        label: "结束时间",
        key: "params[endTime]",
        type: "DatePicker"
      }
    ];
    this.setState({ formItmes: formItems });
  };

  // componentWillReceiveProps(nextProps, nextContext) {
  //   if (nextProps.data !== this.props.data && nextProps.visible) {
  //     this.searchTable(nextProps);
  //   }
  // }

  searchTable = async (props = this.props) => {
    const { pageSize, curPage, searchParam } = this.state;
    const query = {
      pageSize,
      pageNum: curPage,
      rootUserId: searchParam.rootUserId,
      "params[beginTime]":
        (searchParam.params &&
          searchParam.params.beginTime &&
          searchParam.params.beginTime.format("YYYY-MM-DD")) ||
        "",
      "params[endTime]":
        (searchParam.params &&
          searchParam.params.endTime &&
          searchParam.params.endTime.format("YYYY-MM-DD")) ||
        ""
    };
    try {
      this.setState({
        loading: true
      });
      const result = await axios.post(
        "/channel/vwBusinessCashDayStat/list/group",
        qs.stringify(query)
      );
      if (result.code === 0) {
        this.setState({
          tableData: result,
          loading: false,
          selectedRowKeys: []
        });
      } else {
        this.setState({
          loading: false
        });
        message.error(result.msg);
      }
    } catch (e) {
      this.setState({
        loading: false
      });
      message.error(e.message);
    }
  };

  handleSearch = value => {
    this.setState(
      {
        curPage: 1,
        searchParam: value
      },
      this.searchTable
    );
  };
  render() {
    const { loading, tableData, formItmes, initForm } = this.state;
    const columns = [
      {
        title: "组长",
        dataIndex: "groupUserName",
        key: "groupUserName"
      },
      {
        title: "入金金额",
        dataIndex: "sjjeSum",
        key: "sjjeSum"
      },
      {
        title: "手续费",
        dataIndex: "feeSum",
        key: "feeSum"
      },
      {
        title: "出金金额",
        dataIndex: "hasCashSum",
        key: "hasCashSum"
      }
    ];

    return (
      <Spin spinning={loading}>
        <MyForm
          initForm={initForm}
          items={formItmes}
          handleSearch={this.handleSearch}
        />
        <Table
          dataSource={tableData.rows}
          columns={columns}
          rowKey={"rootUserId"}
          scroll={{ x: true }}
        />
      </Spin>
    );
  }
}

export default connect(
  mapStateToProps,
  mapDispatchToProps
)(withRouter(GroupStatTable));
